<template>
  <el-card-comon>

    <!-- 搜索按钮 -->
    <el-btn-serch-input :queryInfo="queryInfo" inputContentClearEmitName="searchClear"
    searchEmitName="searchBtnClick" :isShowRightBtn="false" />

    <!-- table组件 -->
    <order-table :orderList="orderList" />

    <!-- 分页组件 -->
    <el-pagination-com 
    :nowPage.sync="queryInfo.pageNum" 
    :pageNumber.sync="queryInfo.pageSize" 
    :total="total"
    changeSizeName="changePageNumber" 
    changeSizeNumberName="changeNowSize" />

    <!-- 编辑dialog组件 -->
    <order-edit-dialog></order-edit-dialog>

  </el-card-comon>
</template>

<script>
// 组件
  import ElCardComon from '@/components/common/ElCardComon';
  import ElBtnSerchInput from '@/components/common/ElBtnSerchInput';
  import OrderTable from '@/views/Main/order/orderCompent/OrderTable';
  import ElPaginationCom from '@/components/common/ElPaginationCom';
  import OrderEditDialog from '@/views/Main/order/orderCompent/OrderEditDialog';

// 请求
  import {orderDataList} from '@/network/orderRequest';

export default {
  data() {
    return {
      queryInfo: {
        query: '', // 查询参数
        pageNum: 1, // 当前页面
        pageSize: 10, // 当前每页显示多少条数据
      },
      orderList: [], // 订单数据列表
      total: 0, // 订单总数
      
    }
  },
  methods: {
    searchClear() { // 搜索框清空执行函数
      return this.orderDataRequest();
    },
    searchBtnClick() { // 搜索按钮点击触发
      return this.orderDataRequest();
    },
    async orderDataRequest() { // 订单数据请求
      const {data, meta} = await orderDataList(this.queryInfo);

      // 获取失败
      if (meta.status !== 200) {
        console.log(meta);
        return this.$message.error(meta.msg);
      }

      // 成功获取
      this.orderList = data.page.list; // 订单数据
      return this.total = data.page.total;
    },
    changeNowSize() { // 当前页面改变
      return this.orderDataRequest();
    },
    changePageNumber() { // 每页数据改变监听
      return this.orderDataRequest();
    }
  },
  created() {
    this.$bus.$on('searchClear', this.searchClear);
    this.$bus.$on('searchBtnClick', this.searchBtnClick);
    this.$bus.$on('changeNowSize', this.changeNowSize);
    this.$bus.$on('changePageNumber', this.changePageNumber);
    this.$bus.$on('getOrderData', this.orderDataRequest); // 重新获取请求
    this.orderDataRequest();
  },
  destroyed() {
    this.$bus.$off('searchClear');
    this.$bus.$off('searchBtnClick');
    this.$bus.$off('changeNowSize');
    this.$bus.$off('changePageNumber');
    this.$bus.$off('getOrderData');
  },
  components: {
    ElCardComon,
    ElBtnSerchInput,
    OrderTable,
    ElPaginationCom,
    OrderEditDialog
  }
}
</script>

<style lang="scss" scoped>

</style>